@layout("/common/_container.html"){
<div class="container-fluid" style="padding: 0 !important;">
	<div class="row">
		<div class="col-sm-12">
			@for(notice in noticeList){
				<div class="alert alert-success alert-dismissable">
					<button aria-hidden="true" data-dismiss="alert" class="close" type="button">×</button>
					${notice.content}
				</div>
			@}
		</div>
		<p></p>
		<center>
    <div><h2>期刊类型占比图</h2> 
          <!-- 为ECharts准备一个具备大小（宽高）的Dom -->
    <div id="main" style="width: 600px;height:350px;"></div>
    <script src="../static/blog/echarts.min.js"></script>
    <script type="text/javascript">
        // 基于准备好的dom，初始化echarts实例
        var myChart = echarts.init(document.getElementById('main'));
        var option = {
        	    tooltip: {
        	        trigger: 'item',
        	        formatter: '{a} <br/>{b}: {c} ({d}%)'
        	    },
        	    legend: {
        	        orient: 'vertical',
        	        left: 10,
        	        data: ['医学期刊', '影视期刊', '科技期刊', '旅游期刊', '时尚期刊','生活期刊','教育期刊','美食期刊']
        	    },
        	    series: [
        	        {
        	            name: '期刊类型',
        	            type: 'pie',
        	            radius: ['50%', '70%'],
        	            avoidLabelOverlap: false,
        	            label: {
        	                show: false,
        	                position: 'center'
        	            },
        	            emphasis: {
        	                label: {
        	                    show: true,
        	                    fontSize: '30',
        	                    fontWeight: 'bold'
        	                }
        	            },
        	            labelLine: {
        	                show: false
        	            },
        	            data: [
        	                {value: 335, name: '医学期刊'},
        	                {value: 310, name: '影视期刊'},
        	                {value: 234, name: '科技期刊'},
        	                {value: 135, name: '旅游期刊'},
        	                {value: 1000, name:'时尚期刊'},
        	                {value: 132, name:'生活期刊'},
        	                {value: 154, name:'教育期刊'},
        	                {value: 128, name:'美食期刊'}
        	            ]
        	        }
        	    ]
        	};
        myChart.setOption(option);
        </script>
    </div>
  </center>
    	
	</div>
</div>
@}
